<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>动态添加和删除节点</title>
		<style type="text/css">
			.myArea{ width: 100%; height: 80px;}
			.myDiv{ line-height: 30px;}
		</style>
	
	</head>
	<body>
		<h2>工作经历</h2>
		<hr/>
		<div id="myContainer">
			<div class="myDiv" id="div1">
				公司名称:<input type="text" />
				职位:<input type="text" />
				<a href="#" onclick="delect1()">删除工作经历</a>
				<br />
				工作职责及工作内容描述:
				<textarea class="myArea"></textarea>
				<hr />
			</div>			
		</div>
		
		<div style="line-height: 30px; text-align: right;">
			<a href="#" onclick="add1()">添加工作经历 </a>
		</div>
		<script>
            // ======代码=======//
          
			var div=document.getElementById("div1")
			function delect1(){
				var select1=document.getElementsByTagName('h4')
				console.log(select1[0].value);
			}



			function add1() {
				var class1 = document.querySelector('textarea')
				var value1=document.querySelectorAll("input")
				var newH4 = document.createElement('h4');
                h2.setAttribute('na','cp');
				var add11=document.createTextNode('公司名称:'+value1[0].value+'职位:'+value1[1].value+'工作职责及工作内容描述:'+class1.value)
				newH4.appendChild(add11)
				div.appendChild(newH4)
				
			}
        </script>
	</body>
</html>